<div class="rightDiv">
  <div class="exciseTableDiv">
    <div class="line-6 w100">
      <div class="fl-l">
        <button nz-button nzType="primary" (click)="clickAdd()">
          <i nz-icon nzType="plus" nzTheme="outline"></i>新增
        </button>
      </div>
    </div>
    <div class="fl-l w100">
      <ng-template #totalTemplate let-total>总共 {{ pageInfo.totalRecords? pageInfo.totalRecords:0 }} 条</ng-template>
      <nz-table
        #exciseBankTable
        nzBordered
        [nzData]="allList"
        [nzFrontPagination]="false"
        [nzShowPagination]="true"
        [nzPageIndex]="pageInfo.first"
        [nzTotal]="pageInfo.totalRecords"
        [nzShowTotal]="totalTemplate"
        [nzPageSize]="pageInfo.rows"
        [nzLoadingDelay]="1"
        [nzPageSizeOptions]="[10,20,30,50,100]"
        [nzShowQuickJumper]="true"
        [nzShowSizeChanger]="true"
        (nzPageIndexChange)="pageInfo.first = $event;page()"
        (nzPageSizeChange)="pageInfo.rows = $event;page()"
      >
        <thead>
        <tr>
          <th class="TableIndex">序号</th>
          <th>app名称</th>
          <th>版本号</th>
          <th>操作用户</th>
          <th>操作时间</th>
          <th>版本说明</th>
          <th>是否强制更新</th>
          <th>是否最新版本</th>
          <th style="width:130px;">操作</th>
        </tr>
        </thead>
        <tbody>
        <tr *ngFor="let data of allList;let i =index">
          <td>{{i+1}}</td>
          <td>{{ data.appName ? data.appName : '-' }}</td>
          <td>{{ data.versionId ? data.versionId : '-'}}</td>
          <td>{{ data.operator ? data.operator : '-'}}</td>
          <td>{{ data.gmtCreate | date: "yyyy-MM-dd HH:mm:ss" }}</td>
          <td>
            <div style="width:200px;margin: 0 auto;" class="spance" title="{{data.versionRemark}}">
              {{ data.versionRemark ? data.versionRemark : ''}}
            </div>
          </td>
          <td>
            <nz-switch [(ngModel)]="data.autoUpdate" (ngModelChange)="changeStatus(data)" nzCheckedChildren="是" nzUnCheckedChildren="否"></nz-switch>
          </td>
          <td>{{ data.newApp === 1?'是' : '否'}}</td>
          <td>
            <span class="operaFont firOpera" (click)="edit(data)">编辑</span>
            <span class="operaFont operaTao"
                  nz-popconfirm
                  nzOkType="danger"
                  nzTitle="确定删除该版本吗?"
                  (nzOnConfirm)="delete(data.id)"
                  nzPlacement="top"
            >删除</span>
          </td>
        </tr>
        </tbody>
      </nz-table>
    </div>
  </div>
</div>
<!--新增-->
<nz-modal [(nzVisible)]="isVisible"
          nzWidth="530px"
          [nzTitle]="modalTitle"
          [nzContent]="modalContent"
          (nzOnCancel)="isVisible = false"
          [nzFooter]="footModel"
          nzMaskClosable="false"
>
  <ng-template #modalTitle>
    <span>{{isAdd ?'新增APP版本': '编辑APP版本'}}</span>
  </ng-template>
  <ng-template #modalContent>
    <form nz-form [formGroup]="validateForm">
      <div nz-row>
        <div nz-col nzSpan="24">
          <nz-form-item>
            <nz-form-label nzRequired [nzSm]="7">
              app名称
            </nz-form-label>
            <nz-form-control [nzSm]="16" [nzXs]="12">
              <input nz-input placeholder="请输入" [(ngModel)]="param.appName" formControlName="appName"/>
              <nz-form-explain
                *ngIf="validateForm.get('appName').dirty && validateForm.get('appName').errors">
                <span [hidden]="!validateForm.hasError('required','appName')">app名称必填</span>
              </nz-form-explain>
            </nz-form-control>
          </nz-form-item>
        </div>
      </div>
      <div nz-row>
        <div nz-col nzSpan="24">
          <nz-form-item>
            <nz-form-label nzRequired [nzSm]="7">
              版本号
            </nz-form-label>
            <nz-form-control [nzSm]="16" [nzXs]="12">
              <input nz-input placeholder="请输入" [(ngModel)]="param.versionId" formControlName="versionId"/>
              <nz-form-explain
                *ngIf="validateForm.get('versionId').dirty && validateForm.get('versionId').errors">
                <span [hidden]="!validateForm.hasError('required','versionId')">版本号必填</span>
              </nz-form-explain>
            </nz-form-control>
          </nz-form-item>
        </div>
      </div>
      <div nz-row>
        <div nz-col nzSpan="24">
          <nz-form-item>
            <nz-form-label nzRequired [nzSm]="7">
              版本说明
            </nz-form-label>
            <nz-form-control [nzSm]="16" [nzXs]="12">
              <label>
                <textarea nz-input [(ngModel)]="param.versionRemark" formControlName="versionRemark" placeholder="请输入版本说明" [nzAutosize]="{ minRows: 3, maxRows: 5 }"></textarea>
              </label>
              <nz-form-explain
              *ngIf="validateForm.get('versionRemark').dirty && validateForm.get('versionRemark').errors">
              <span [hidden]="!validateForm.hasError('required','versionRemark')">版本说明必填</span>
            </nz-form-explain>
            </nz-form-control>
          </nz-form-item>
        </div>
      </div>
      <div nz-row>
        <div nz-col nzSpan="24">
          <nz-form-item>
            <nz-form-label nzRequired [nzSm]="7">
              上传app包
            </nz-form-label>
            <nz-form-control [nzSm]="16" [nzXs]="12">
              <nz-upload
              [nzAction]="uploadUrl"
              [nzHeaders]="headerInfo"
              [nzData]="{'moduleName': 'app-version'}"
              [nzRemove]="deleteFlile"
              (nzChange)="getUploadInfo($event)"
              [nzFileList]="fileList"
              nzMultiple
              [nzLimit]="1"
              [nzAccept]="'.apk'"
            >
              <div class="upload-btn-box">
                <button nz-button nzType="default">
                  <i nz-icon nzType="arrow-up" nzTheme="outline"></i>上传
                </button>
                <span class="length-tip">
                  <span class="number">1</span>
                  个
                </span>
                <span class="tip">支持扩展名：apk</span>
              </div>
            </nz-upload>
            </nz-form-control>
            <nz-form-explain
            *ngIf="validateForm.get('appSourceId').dirty && validateForm.get('appSourceId').errors">
            <span [hidden]="!validateForm.hasError('required','appSourceId')">请上传apk文件</span>
          </nz-form-explain>
          </nz-form-item>
        </div>
      </div>
      <div nz-row>
        <div nz-col nzSpan="24">
          <nz-form-item>
            <nz-form-label nzRequired [nzSm]="7">
              是否强制更新
            </nz-form-label>
            <nz-form-control [nzSm]="16" [nzXs]="12">
              <nz-radio-group [(ngModel)]="param.autoUpdate" formControlName="autoUpdate">
                <label nz-radio [nzValue]="1">是</label>
                <label nz-radio [nzValue]="0">否</label>
              </nz-radio-group>
            </nz-form-control>
          </nz-form-item>
        </div>
      </div>
    </form>
  </ng-template>
  <ng-template #footModel>
    <button nz-button nzType="default" (click)="isVisible = false;isAdd=false;isEdit=false;">取消</button>
    <button nz-button nzType="primary" [disabled]="!validateForm.valid" (click)="submit()">保存</button>
  </ng-template>
</nz-modal>
